$(function () {
    var url = 'http://localhost:3000/v1/sq/Travel_Guide'

    $.get(url, data => {
        console.log(data)
        $('#body>.main>.left>.bottom>ul').html(
            data.data.map(value => {
                const { avatar, username, place, tsan, ctime, title, detail, prime, pic } = value
                return `
            <li><i class="xian"></i><span class="inbg"></span>
            <img src="${avatar}" alt="">
                    <div class="top">
                        <span>${username}</span>
                        <div class="yoo">在 <em>${place}</em> 发布的笔记 <i class="praise"></i><span>${tsan}</span>人赞</div>
                        <div class="ctime"><i class="zhhf"></i>最后回复于${ctime}</div>
                    </div>
                    <div class="bottom">
                    <div class="text">
                        <p>${title}</p>
                        <span>${detail}</span>
                        </div>
                        <div class="img"><img src="${pic}" alt=""></div></div>
                </li>
            `
            })
        )
    })

    var url = 'http://localhost:3000/v1/sq/Travel_Banner'
    $.get(url, data => {
        console.log(data)
        $('#body .banner>.container>.fi').html(
            data.data.map(value => {
                const { avatar, username, pic, title } = value
                return `
            <li>
            <div>
                <img src="https://common1.qyerstatic.com/bbs/old/images/authentication_u.png" alt="" class="icon">
                <div class="img">
                    <img src="${pic}" alt="">
                </div>
                <img src="${avatar}" alt="" class="avatar">
                <div class="text">
                    <p>${username}</p>
                    <span>${title}</span>
                </div>
            </div>

        </li>
            `
            })
        )
        $('.container>.fi>li').eq(0).addClass('active')
        $('.bac li').eq(0).addClass('active')
        $('.banner .container .se li').hover(function () {
            
            var i = $(this).index()
            $('.container>.fi>li').eq(i).addClass('active').siblings().removeClass('active')
            $('.bac li').eq(i).addClass('active').siblings().removeClass('active')
        })
    })


})
